{include file="public/head"}
<div class="x-body layui-form">
    <table class="layui-table">
        <colgroup>
            <col width="50px">
            <col>
        </colgroup>
        <thead>
        <tr>
            <td>全选</td>
            <td>角色名</td>
        </tr>
        </thead>
        <tbody>
        <td>
            <div class="header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
        </td>
        <td>
            {volist name="role" id="vo"}
            <div class="layui-form-checkbox" lay-skin="primary" data-id='{$vo.id}'>
                <i class="layui-icon">&#xe605;</i></div>{$vo.title}
            {/volist}
        </td>
        <tr>
            <td colspan="2">
                <ul id="tree" class="ztree"></ul>
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <button id="auth-btn" style="width: 100%" class="layui-btn layui-btn-sm">提交保存</button>
            </td>
        </tr>
        </tbody>
    </table>
</div>
{include file="public/foot"}
<link rel="stylesheet" href="__module__/ztree/css/metroStyle/metroStyle.css" type="text/css">
<script type="text/javascript" src="__module__/ztree/js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="__module__/ztree/js/jquery.ztree.core.js"></script>
<script type="text/javascript" src="__module__/ztree/js/jquery.ztree.excheck.js"></script>
<script type="text/javascript">
    $(function () {
        var form = layui.form;
        form.render();
        var tree = $("#tree");
        var zTree;
        var setting = {
            check: {
                enable: true
            },
            view: {
                dblClickExpand: true,
                showLine: true,
                showIcon: true,
                selectedMulti: false
            },
            data: {
                simpleData: {
                    enable: true,
                    idKey: "id",
                    pIdKey: "pid",
                    rootpid: ""
                },
                key: {
                    name: "title"
                }
            }
        };
        //加载树形菜单
        $.ajax({
            url: "{:url('admin/auth/getJson')}",
            type: "post",
            dataType: "json",
            cache: false,
            data: {
                id: ''
            },
            success: function (data) {
                zTree = $.fn.zTree.init(tree, setting, data);
            }
        });
        /**
         * 授权提交
         */
        $("#auth-btn").bind("click", function () {
            var data = tableCheck.getData();
            if (data.length == 0) {
                layer.msg("请选择需要授权的角色");
                return false;
            }
            var checked_ids, auth_rule_ids = [];
            checked_ids = zTree.getCheckedNodes(); // 获取当前选中的checkbox
            $.each(checked_ids, function (index, item) {
                auth_rule_ids.push(item.id);
            });
            layer.load(1);
            $.ajax({
                url: "{:url('admin/auth/batchLicensing')}",
                type: "post",
                cache: false,
                data: {
                    id: data,
                    auth_rule_ids: auth_rule_ids
                },
                success: function (data) {
                    layer.closeAll('loading');
                    if (data.code === 1) {
                        layer.msg(data.msg, {icon: 1, time: 1000, offset: 't'}, function () {
                            x_admin_close();
                        })
                    } else {
                        layer.msg(data.msg, {icon: 2, offset: 't'});
                    }
                }
            });
        });
    })

</script>
